import React, { useState } from 'react'
import { View, Text, Input, Image, Textarea } from '@tarojs/components'
import PageWrapper from '@/components/PageWrapper'
import './index.scss';
import {navigateTo} from "@/utils/navigation";
const Type = ({ data }: { data: any[] }) => {
  return (
    <View className="community-type-box">
      {data.map((item,index)  => (
        <View key={index} className={item.checked !== 1 ? 'community-type-item' : 'community-type-item-checked'}>
          <View className="community-type-title">{item.name}</View>
        </View>
      ))}
    </View>
  );
};
const Page = () => {
  const typeList = [
    { name: '全部', index: 0 ,checked: 1},
    { name: '最新获得', index: 1 ,checked: 0},
    { name: '即将过期', index: 2 ,checked: 0},
  ];
  return (
    <PageWrapper title="我的优惠券" showBack={true} backgroundColor='#F0F0F0'>
      <Type data={typeList}></Type>
      <View className="coupon-box">
        <View className="coupon-item"  onClick={() => navigateTo('/pages/user/coupon-remove/index')}>
          <View className="img">
            <Image src={require(`../../../assets/photo.png`)}/>
          </View>
          <View className="title-box">
            <View className="tip">分享券</View>
            <View className="title">100元代金券</View>
          </View>
          <View className="time">2025.12.02</View>
          <View className="verified">去核销</View>
        </View>
        <View className="coupon-item">
          <View className="img">
            <Image src={require(`../../../assets/photo.png`)}/>
          </View>
          <View className="title-box">
            <View className="tip">分享券</View>
            <View className="title">100元代金券</View>
          </View>
          <View className="time">2025.12.02</View>
          <View className="verified">去核销</View>
        </View>
      </View>
    </PageWrapper>
  )
}

export default Page
